<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>后台管理系统</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="http://hippostatic.oss-cn-beijing.aliyuncs.com/admin/css/global.css?t=1488795362026" media="all">
    <link rel="stylesheet" href="http://hippostatic.oss-cn-beijing.aliyuncs.com/admin/css/layui.css?t=1488795362026">
    <script src="http://hippostatic.oss-cn-beijing.aliyuncs.com/admin/js/jquery.js"></script>
</head>

<body>
    <div class="layui-layout layui-layout-admin">
        <div class="layui-header header header-demo">
            <div class="layui-main"> <a class="logo" href="/"> </a>
                <ul class="layui-nav" pc>
                    <li class="right"> <span> 用户：yuhe</span><a href="/logout" class="out">退出</a> </li>
                </ul>
            </div>
        </div>
        <div class="layui-side layui-bg-black">
            <div class="layui-side-scroll">
                <ul class="layui-nav layui-nav-tree site-demo-nav">
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">基础内容管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/series/list">系列管理</a></dd>
                            <dd class="layui-this"><a href="/live/list">直播管理</a></dd>
                            <dd class=""><a href="/video/list">视频管理</a></dd>
                            <dd class=""><a href="/article/list">图文管理</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">聚合内容管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/competition/list">赛事管理</a></dd>
                            <dd class=""><a href="/organization/list">机构管理</a></dd>
                            <dd class=""><a href="/feed/list">标准列表管理</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">Tab管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/f1/article/list">F1管理</a></dd>
                            <dd class=""><a href="/ad/list">F1 Banner</a></dd>
                            <dd class=""><a href="/ad/start/list">启动屏广告</a></dd>
                            <dd class=""><a href="/f1/sorting/list">F1排序</a></dd>
                            <dd class=""><a href="/f2/sorting/list">F2-Tab1排序</a></dd>
                            <dd class=""><a href="/f2/recordSorting/list">F2-Tab2排序</a></dd>
                            <dd class=""><a href="/channel/list">F3频道管理</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">运营管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/review/list">评论管理</a></dd>
                            <dd class=""><a href="/user/message/home">系统消息</a></dd>
                            <dd class=""><a href="/feedback/list">用户反馈</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">统计信息</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/statistics/result/list">统计信息</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">用户管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/user/list">用户管理</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item layui-nav-itemed"><a class="javascript:;" href="javascript:;">系统管理</a>
                        <dl class="layui-nav-child">
                            <dd class=""><a href="/admin/user/list">后台帐号管理</a></dd>
                            <dd class=""><a href="/multi_app/list">App管理</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item" style="height: 30px; text-align: center"></li>
                </ul>
            </div>
        </div>
        <div class="layui-tab layui-tab-brief" lay-filter="demoTitle">
            <div class="layui-body layui-tab-content site-demo site-demo-body">
                <div class="mian">
                    <div class="edit_live">
                        <div class="title">流编辑</div>
                        <ul class="list">
                           <li>
                           </li>
                        </ul>
                        <div class="la_title">拉流地址(用于转播第三方直播)</div>
                        
                        <div class="item">
                             
                        </div>
                        
                        
                        <div class="add_live">
                            <form class="layui-form enen" >
                                <div class="layui-form-item">
                                    <label class="layui-form-label">开始时间：</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="startTime" required lay-verify="required" id="start" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" class="layui-input" style="width:200px;">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">结束时间：</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="endTime" required lay-verify="required" id="end" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" class="layui-input" style="width:200px;">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">拉流地址：</label>
                                    <div class="layui-input-block">
                                        <textarea type="text" name="sourceUrl" required lay-verify="required" placeholder="请输入地址" autocomplete="off" class="layui-textarea" style="width:400px;"></textarea>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-input-block">
                                        <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
                                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                                         <a href="javascript:;" class="btn delAll" data-del="//gm.hippotv.cn/live/stream/delete.json">删除全部</a>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-footer footer footer-demo">
            <div class="layui-main">
                <p>2017 &copy; <a href="/">layui.com</a> MIT license</p>
            </div>
        </div>
        <div class="site-tree-mobile layui-hide"> <i class="layui-icon">&#xe602;</i> </div>
        <div class="site-mobile-shade"></div>
    </div>
    <script src="http://hippostatic.oss-cn-beijing.aliyuncs.com/admin/layui.js"></script>
    <script src="http://hippostatic.oss-cn-beijing.aliyuncs.com/admin/js/fun.js"></script>
    <style type="text/css">
    .edit_live {}
    .kz_tishi {
        line-height: 20px;
        font-size: 16px;
        text-align: center;
        background: rgba(0, 0, 0, .6);
        color: #FFF;
        z-index: 3000;
        padding: 0 15px;
        border-radius: 4px;
        padding: 14px 10px;
    }
    .edit_live .title {
        background: #ebebeb;
        height: 40px;
        line-height: 40px;
        padding-left: 15px;
        font-size: 16px;
        font-weight: bold;
    }
    .edit_live .list {}
    .edit_live .list li {
        border-bottom: 1px solid #dadada;
        padding: 20px;
        overflow: hidden;
    }
    .edit_live .list li {
        line-height: 24px;
    }
    .edit_live .la_title{
      line-height: 40px;
      padding-left: 20px;
      margin-top: 10px;
    }
    .edit_live .left {
        width: 800px;
        float: left;
        word-wrap: break-word
    }
    .edit_live .copy,
    .edit_live .btn {
        display: inline-block;
        line-height: 37px;
        padding: 0 20px;
        background: #dadada;
        position: relative;
        left: 20px;
        top: 1px;
    }
    .edit_live .list li a.copy{
        top: 15px;
    }
    .edit_live .add_live {
        margin-top: 40px;
      
    }
    .edit_live .btn_submit {
        margin-left: 114px;

    }
    .edit_live .btn_submit a {
        top: 0px;
    }
    .edit_live .item{
         line-height: 25px;
         margin-top: 10px;
         padding-left: 10px;
         background: #ebebeb
    }
    .edit_live .item .la_list{
          border-bottom: 1px solid #dadada;
            padding: 10px;
            
    }
    </style>
    <script>
    function getQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
    }
    //复制url
    function copyUrl(val) {
        var _dom = document.createElement('textarea');
        _dom.value = val
        document.body.appendChild(_dom);
        _dom.select();
        document.execCommand('copy');
        document.body.removeChild(_dom);
    }
    $("body").on("click", ".copy", function(event) {
        KZ.form.Prompt("复制成功", 1)
        copyUrl($(this).closest('li').find("span").text())
    });
    $(".addStream").click(function(event) {
        var add_live = $(".add_live");
        add_live.show()
    });
    //
    $.ajax({
        //url: "//gm.hippotv.cn/live/stream/info.json?id="+getQueryString("id"),
        url: "json/live_list.php",
        type: "GET",
        dataType: "json",
        success: function(data) {
            if (data.rescode == 0) {
                var html=' <li><p>ID：<em id="id">'+data.id+'</em></p><p>标题:'+data.title+'</p></li><li>\
                            <div class="left">\
                                推流地址\
                                <br/> <span>'+data.pushUrl+'</span>\
                            </div>\
                            <a href="javascript:;" class="copy">复制地址</a>\
                         </li><li>\
                            <div class="left">\
                                分发地址\
                                <br/> <span>'+data.playUrl+'</span>\
                            </div>\
                            <a href="javascript:;" class="copy">复制地址</a>\
                         </li>'
                 var pull='';
                 for(var i=0;i<data.streamConfigList.length;i++){
                    var obj=data.streamConfigList[i];
                    pull+='<div class="la_list" data-start='+Date.parse(obj.startTime)/1000+' data-end='+Date.parse(obj.endTime)/1000+'>\
                                   <div>开始时间：'+obj.startTime+'</div>\
                                   <div>结束时间：'+obj.endTime+'</div>\
                                   <div>拉流地址：'+obj.sourceUrl+'</div>\
                            </div>'
                 }
                $(".list").html(html);
                $(".item").html(pull);
            } 
        },
        error: function(er) {
             alert(er)
        }
    });
    layui.use('form', function() {
        var form = layui.form();
        //监听提交
        form.on('submit(formDemo)', function(data) {
            //layer.msg(JSON.stringify(data.field));
            data.field.id=$("#id").text()
            var start = Date.parse(data.field.startTime) / 1000;
            var end = Date.parse(data.field.endTime) / 1000;
            var flg = true
            $(".la_list").each(function(index, el) {
                var old__start = $(this).data("start");
                var old__end = $(this).data("end");
                if ((old__start < start && start < old__end) || (old__start < end && end < old__end) || (old__start > start && end > old__end) ) {
                    layer.msg("与原有时间冲突");
                    flg = false
                    return flg
                }

                return flg
            });
            if (flg) {
                  layui.use('layer', function() {
                   var layer = layui.layer;
                      layer.confirm('确认提交？',{title:"提示信息"}, function(index) {
                           $.ajax({
                                url: "//gm.hippotv.cn/live/stream/add.json",
                                data: data.field,
                                type: "POST",
                                dataType: "json",
                                success: function(data) {
                                    if(data.rescode==0){
                                        layer.msg(data.resmsg);
                                        setTimeout(function(){
                                            location.replace()
                                        },15000)
                                    }
                                    else
                                    {
                                        layer.msg(data.resmsg);
                                    }
                                },
                                error: function(er) {
                                     alert(er)
                                }
                            });
                      })
                   })
               
            }
            return false;
        });
    });
    layui.use('layer', function() {
        var layer = layui.layer;
        $("[data-del]").each(function(index, element) {
            var T = $(this);
            T.click(function() {
                var url = $(this).data("del");
                layer.confirm('<div style="text-align: center; width: 324px"><h3 style="font-size:14px;font-weight: bold;">删除并编辑全部</h3>原拉流被全部删除<br/>操作后所有内容需要全部提交一遍<br/>谨慎操作</div>',{title:"提示信息"}, function(index) {
                    $.ajax({
                        url: url,
                        data: {id:$("#id").text()},
                        type: "get",
                        dataType: "json",
                        success: function(data) {
                            if (data.rescode == 0) {
                                window.location.reload();
                            }
                            else
                            {
                                layer.msg(data.resmsg);
                            }
                        },
                        error: function(er) {
                            alert(er)
                        }
                    });

                });

            })

        });
    });
    </script>
</body>
</html>